<template>
	<view>
		<cu-custom bgColor="bg-gradual-green" :isBack="true">
			<block slot="content">民宿订单</block>
		</cu-custom>
		
		<scroll-view scroll-y="true" >
			<view class="orderListView">
			
				<view class="emptyList" v-if="orderList.length == 0">
					没有该类订单嗷~
				</view>
			
			
				<view class="orderListItem" v-for="order in orderList">
					<view class="orderInfoView">
						<view class="orderImageView">
							<image :src="'https://www.2306.tech/CCShop/'+order.imgUrl" style="width: 200upx; height: 200upx; border-radius: 10upx;"></image>
						</view>
						<view class="orderDetailInfoView">
							<view class="orderName">{{order.name}} </view>
							<view class="address">{{order.sites}}</view>
							<view class="orderCount">
								<view class="checkInTime">入住日期：{{order.hoseStart.year + 1900}}-{{order.hoseStart.month + 1}}-{{order.hoseStart.date}}</view>
								<view class="checkOutTime">离店日期：{{order.hoseEnd.year + 1900}}-{{order.hoseEnd.month + 1}}-{{order.hoseEnd.date}}</view>
							</view>
							<!-- <view class="orderTotalPrice">{{order.orderStatus}}总金额：<text class="text-price text-red" style="font-size: 18px;">{{order.orderTotalFee}}</text></view> -->
						</view>
					</view>
					<view class="orderButtonArea">
						<view class="createTime"></view>
						<view class="buttons">
							<button class="cu-btn round shadow btn" :data-id="order.hoseId" v-if="pageType == 0" @click="doCancel(order.hoseId)">取消订单</button>
							<button class="cu-btn round bg-blue shadow btn" :data-id="order.hoseId" v-if="pageType == 0" @click="goPay(order.hoseId)">支付订单</button>
							<text class="text-green" v-if="pageType == 1" style="margin-right: 10upx;">待入住</text>
							<text class="text-green" v-if="pageType == 3" style="margin-right: 10upx;">感谢您选择{{order.name}},期待您的下次入住！</text>
							
							<button class="cu-btn round bg-green shadow btn" :data-id="order.hoseId" @click="doConfirm(order.hoseId)" v-if="pageType == 6">确认收货</button>
			
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
		
	</view>
</template>

<script>
	import { getHOrderByOpenIdAndStatus,updateOrderStatusToCancle } from '../../api/hOrderAPI.js'
	export default {
		data() {
			return {
				orderList: [
					// {
					//     "imgUrl": "images/homestay/A0099/A0099-0.jpg",
					//     "hRoom": "3",
					//     "hoseStart": {
					//         "date": 10,
					//         "hours": 0,
					//         "seconds": 0,
					//         "month": 6,
					//         "timezoneOffset": -480,
					//         "year": 119,
					//         "minutes": 0,
					//         "time": 1562688000000,
					//         "day": 3
					//     },
					//     "hoseEnd": {
					//         "date": 12,
					//         "hours": 0,
					//         "seconds": 0,
					//         "month": 6,
					//         "timezoneOffset": -480,
					//         "year": 119,
					//         "minutes": 0,
					//         "time": 1562860800000,
					//         "day": 5
					//     },
					//     "name": "林山民宿",
					//     "hToilet": "1",
					//     "hSize": "98",
					//     "sites": "阜平县坊里村",
					//     "hHall": "1",
					//     "hoseId": "H20190627233816401",
					//     "hBedCount": "3"
					// }
				],
				pageType: 0
			}
		},
		onLoad(params) {
			this.pageType = params.status;
			getHOrderByOpenIdAndStatus(params.status).then(resp => {
				this.orderList = resp
			})
		},
		onPullDownRefresh() {
			setTimeout(()=>{
				getHOrderByOpenIdAndStatus(this.pageType).then((resp) => {
					this.orderList = resp
				})
				uni.stopPullDownRefresh()
			},2000)
		},
		methods: {
			goPay(orderId) {
				uni.navigateTo({
					url:'../pay/pay?type=2&id='+orderId
				})
			},
			doCancel(orderId) {
				uni.showModal({
					title: '提示',
					content: '确认取消订单吗?',
					confirmColor: 'red',
					confirmText: '取消订单',
					cancelText: '再想想',
					success: (resp) => {
						if (resp.confirm) {
							updateOrderStatusToCancle(orderId).then(resp => {
								if (true === resp.result) {
									uni.showToast({
										title: '订单已取消'
									})
									uni.startPullDownRefresh({
			
									})
				
			
								}
							})
						}
					}
				})
			},
		}
	}
</script>

<style> 
	@import url("hOrderList.css");
</style>
